﻿body, html { -webkit-tap-highlight-color: transparent; font-family: "幼圆","黑体", Helvetica, Arial, sans-serif; }
body { overflow-x: hidden; background-color: #fff5cd; cursor: pointer; }
#topheadtxt { font-size: 1.1rem; }
.container { height: 100%; /*overflow-y: auto;*/ -webkit-overflow-scrolling: touch; }
.koo_form_head { position: fixed; top: 0; left: 0; touch-action: none; z-index: 1; background: url(../images/top_bian.png) no-repeat bottom center transparent; background-size: 100% 1.4133rem; width: 100%; text-align: center; color: #fff; }
    .koo_form_head span { font-size: 1.3rem; }
    .koo_form_head > div { background-color: #f47a1f; margin-bottom: 1.31rem; height: 3.65rem; line-height: 3.65rem; }
        .koo_form_head > div a { background: url(../images/arrow.png) no-repeat center center transparent; width: 1.6866rem; height: 1.366rem; display: inline-block; float: left; margin: 1.09rem 0 0 1.09rem; }
.koo_form_content { padding: 5.25rem 1.5rem 7rem 0.6rem; font-size: 0.9rem; background: url(../images/bg_coo.png) no-repeat center 40%; background-size: 12.875rem 8.75rem; }
    .koo_form_content table { width: 100%; border-collapse: separate; border-spacing: 0.853rem; color: #f47a1f; }
        .koo_form_content table tr td:first-child { line-height: 2.1rem; color: #f47a1f; width: 4.6rem; display: inline-block; text-align: right; }
    .koo_form_content input, .form_select { font-size: 0.9rem; background: transparent; border: solid 1px #f47a1f; -webkit-border-radius: 3px; border-radius: 3px; height: 1.966rem; width: 97%; padding-left: 3%; color: #ff9546; }
    .koo_form_content table label { float: left; }
    .koo_form_content .weui_cells_radio .weui_check_label { float: left; }
.koo_form_footer { width: 100%; touch-action: none; z-index: 1; position: fixed; left: 0; bottom: 0; background-color: #cadc5b; height: 7rem; text-align: center; }
    .koo_form_footer > div { margin: 0.72rem 0 0.73rem; }
    .koo_form_footer a { color: #000; font-size: 0.9rem; line-height: 1.7rem; margin-left: 0.6rem; }
#kooFormBtn { background: url(../images/submit_btn.png) no-repeat center center; background-size: 6.71875rem 2.86rem; display: block; width: 6.8rem; height: 2.9rem; margin: 0 auto; }

.form_select { background: url(../images/arrow_down.png) no-repeat 97% center transparent; background-size: 0.8125rem .46875rem; line-height: 1.99rem; }
#birthday { background: url(../images/riqi.png) no-repeat 3% center; background-size: 0.9375rem; padding-left: 13%; width: 87%; }

.weui_cells_radio .weui_check:checked + .weui_icon_checked:before,
.weui_cells_checkbox .weui_check:checked + .weui_icon_checked:before { color: #f47a1f; }
.weui_cell:before { border: none; }
.weui_mask, .weui_mask_transition, .weui_mask_transparent { z-index: 10; }
.form .weui_dialog { height: 95%; overflow-y: auto; background-color: #f47a1f; color: #fff; width: 93%; }
.form .weui_dialog_bd { color: #fff; }
.form .weui_btn_dialog.primary { color: #fff; }
.form .weui_switch:checked { border-color: #f47a1f; background-color: #f47a1f; }
.form .weui_actionsheet_menu { height: 15rem; overflow-y: auto; z-index: 3; }
.form .weui_actionsheet { -webkit-transition: none; transition: none; }
.form .weui_cell { padding: 5px 5px; }
ul { list-style: none; }
.weui_cells_radio .weui_cell:active { background-color: transparent !important; }
.weui_cells_checkbox .weui_cell:active { background-color: transparent !important; }
.weui_toast { width: 9.6em; }
.weui_fade_toggle { touch-action: none; -webkit-user-select: none; }
.weui_actionsheet { display: none; z-index: 11; }
#myokxieyi a:active, #myokxieyi a:visited, #myokxieyi a:hover { background-color: #f47a1f; }

/*酷儿指数*/
#gaugeChart { width: 90%; height: 17rem; margin: 0 5%; }
#radarChart { padding-top: 5.6rem; height: 350px; width: 290px; }
.qoo_back { background: url(../images/arrow.png) no-repeat center center transparent; width: 1.6866rem; height: 1.366rem; display: inline-block; float: left; margin: 1.09rem 0 0 1.09rem; }
.qoo_index_top { position: relative; background: url('../images/top-bian1.png') repeat-x top center; background-size: 100% auto; /*23.4375rem 5.59375rem*/ height: 6.99375rem; /* 5.59375rem;*/ width: 100%; font-size: 1.2rem; }
    .qoo_index_top .head { position: absolute; top: 0.5rem; left: 1.09375rem; background: url('../images/head-border2.png?v=0.1') no-repeat center center; background-size: 3.5rem; width: 3.5rem; height: 3.5rem; overflow: hidden; text-align: center; }
        .qoo_index_top #qooIndexHead { max-width: 4rem; max-height: 4rem; margin-top:0.09rem; }
    .qoo_index_top .text { text-align: center; font-weight: bold; line-height: 5rem; color: #3f3d3b; }
.qoo_index_intro { background: url('../images/qoo-intro-page.png') no-repeat top center; background-size: 100% auto; /*20.97rem 35.35rem*/ height: 41.5rem; /*35.35rem*/ }
#qooIntroClose { width: 2.5625rem; height: 2.5625rem; position: absolute; top: 4.325rem; right: 0.8rem; display: block; }
.qoo_index_container { background: url('../images/bg-yun.png') no-repeat center 4.1rem #fff5cd; background-size: 23.4375rem 22.1875rem; }
.qoo_index_content { position: relative; min-height: 25.5rem; }
    .qoo_index_content .logo { width: 11.25rem; height: 2.875rem; }
    .qoo_index_content .qiqiu { background: url('../images/hot-qiqiu.png') no-repeat center center; background-size: 10.8125rem 14.96875rem; width: 100%; height: 14.96875rem; position: absolute; top: 10.3125rem; left: 0; text-align: center; }
        .qoo_index_content .qiqiu span { background: url('../images/number.png') no-repeat 0 0; background-size:16.15625rem 1.53125rem; display: inline-block; width: 1.46875rem; height: 1.63125rem; }
        .qoo_index_content .qiqiu .num0 { background-position: 0 0; }
        .qoo_index_content .qiqiu .num1 { background-position: -1.53125rem 0;width:1.3rem; }
        .qoo_index_content .qiqiu .num2 { background-position: -3.0625rem 0; }
        .qoo_index_content .qiqiu .num3 { background-position: -4.59375rem 0; }
        .qoo_index_content .qiqiu .num4 { background-position: -6.125rem 0; }
        .qoo_index_content .qiqiu .num5 { background-position: -7.95625rem 0; }
        .qoo_index_content .qiqiu .num6 { background-position: -9.4875rem 0; }
        .qoo_index_content .qiqiu .num7 { background-position: -11rem 0; }
        .qoo_index_content .qiqiu .num8 { background-position: -12.5rem 0; }
        .qoo_index_content .qiqiu .num9 { background-position: -14.1rem 0; }
        .qoo_index_content .qiqiu .numdot { background-position: -15.7325rem 0; width: 1rem; }

.qoo_index_footer { background: url('../images/bg_bottom.png') repeat-x top center; background-size: 100% auto; /*23.4375rem 7.6875rem*/ width: 100%; /*height:7.4875rem;*/ margin-top: 1.28125rem; }
    .qoo_index_footer .rowline { margin-bottom: 1.34375rem; text-align: center; }
#qooIntro, #qooForm, #qooTopdata, #qooActivity { background: url('../images/qoo-intro.png') no-repeat center center; background-size: 9.71875rem 2.75rem; height: 2.75rem; width: 9.71875rem; display: inline-block; }
#qooForm { background-image: url('../images/qoo-form.png'); width: 9.8125rem; background-size: 9.8125rem 2.75rem; margin-left: 0.6875rem; }
#qooTopdata { background-image: url('../images/qoo-topdata.png'); width: 6.65625rem; background-size: 6.65625rem 2.75rem; margin-right: 3.28125rem; }
#qooActivity { background-image: url('../images/qoo-activity.png'); width: 8.03125rem; background-size: 8.03125rem 2.75rem; }

.qoo_topdata_container { border: solid 1px transparent; position: relative; background: url('../images/bg-topdata.png') no-repeat top left #c5d82e; background-size: 100% 40.46875rem; /*23.40625rem*/ width: 100%; height: 40.46875rem; }
    .qoo_topdata_container .datalist { height: 22.875rem; overflow-y: auto; padding: 0.3125rem; /*float: left; width: 85%;*/ background-color: #fff; border: solid 2px #ffb44a; -webkit-border-radius: 5px; border-radius: 5px; margin: 10.78125rem 1.625rem 0; }
    .qoo_topdata_container table { width: 100%; border-collapse: separate; border-spacing: 0; text-align: center; }
        .qoo_topdata_container table tr { height: 1.90625rem; line-height: 1.90625rem; }
        .qoo_topdata_container table thead { color: #f5632c; font-size: 0.975rem; }
            .qoo_topdata_container table thead th { height: 0; line-height: 0; padding-top: 0; padding-bottom: 0; /*color: transparent;*/ border: none; }
                .qoo_topdata_container table thead th div {position: absolute; background: #fff; color: #f5632c; font-size: 0.975rem; top: 10.9rem; padding-left: 0.36rem; width: 25%; height: 1.90625rem; text-align: left; border: solid 1px #fff; line-height: 2rem;}
        .qoo_topdata_container table tbody tr td { font-size: 0.85rem; color: #4c4948; border: none; }
            .qoo_topdata_container table tbody tr td:nth-child(2) { max-width: 6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
            .qoo_topdata_container table tbody tr td:first-child { -webkit-border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px; }
            .qoo_topdata_container table tbody tr td:last-child { -webkit-border-radius: 0 10px 10px 0; border-radius: 0 10px 10px 0; }
        .qoo_topdata_container table tbody tr:nth-child(even) td { border: solid 1px #fff; }
        .qoo_topdata_container table tbody tr:nth-child(odd) td { border: solid 1px #ffbc5c; }
        .qoo_topdata_container table tbody tr:nth-child(odd) { background-color: #ffbc5c; }
#qooTopDataIntro { background: url('../images/topdata-btn.png') no-repeat center center; background-size: 8.03125rem 2.75rem; height: 2.75rem; width: 8.03125rem; display: inline-block; }
.qoo_topdata_intro { background: url('../images/topdata-intro.png') no-repeat center top; background-size: 100% auto; width: 100%; height: 19rem; }
#qooTopdataClose { width: 2.5625rem; height: 2.5625rem; position: absolute; top: 1.15rem; right: 0.3rem; }

@media only screen and (-webkit-device-pixel-ratio: 2) {
    #qooIntro { background-size: 8.71875rem 2.75rem; width: 8.71875rem; }
    /*.qoo_topdata_intro { background-size: 19rem 14.04375rem; }*/
}

@-webkit-keyframes a {
    0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0; }
    to { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1; }
}

@keyframes a {
    0% { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0; }
    to { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1; }
}

@-webkit-keyframes b {
    0% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1; }
    to { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0; }
}

@keyframes b {
    0% { -webkit-transform: translateZ(0); transform: translateZ(0); opacity: 1; }
    to { -webkit-transform: translate3d(100%,0,0); transform: translate3d(100%,0,0); opacity: 0; }
}

.enter, .leave { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; }
.enter { -webkit-animation: a .2s forwards; animation: a .2s forwards; }
.leave { -webkit-animation: b .25s forwards; animation: b .25s forwards; }

@media screen and (width: 360px) {
    * { font-size: 13px; }

    #gaugeChart { height: 21rem; }
    .qoo_index_intro { height: 44.5rem; }
    #radarChart { padding-left: 0.3rem; padding-top: 7rem; }
    #qooIntro, #qooForm, #qooTopdata, #qooActivity { background: url('../images/qoo-intro.png') no-repeat center center; background-size: 100% auto; height: 2.93rem; width: 10.36rem; display: inline-block; }
    #qooForm { background-image: url('../images/qoo-form.png'); width: 10.46rem; background-size: 100% auto; margin-left: 0.6875rem; }
    #qooTopdata { background-image: url('../images/qoo-topdata.png'); width: 7.1rem; background-size: 100% auto; margin-right: 3.28125rem; }
    #qooActivity { background-image: url('../images/qoo-activity.png'); width: 8.56rem; background-size: 100% auto; }

    .koo_form_content div, .koo_form_content p, .koo_form_footer a, .form_selects_content > div > ul > li, .koo_form_content input, .form_select { font-size: 1.1rem; }
    .koo_form_content table tr td:first-child { font-size: 1.1rem; width: 5rem; }
    .form_valide_txt { line-height: 2.5rem !important; }
    .form_select { line-height: 2rem !important; }

    .qoo_topdata_container { background-size: 100% auto; height: 49rem; }
        .qoo_topdata_container .datalist { height: 30rem; }
}

@media screen and (width: 320px) {
    * { font-size: 13px; }

    #gaugeChart { height: 18rem; }
    #radarChart { height: 330px; width: 260px; }

    .koo_form_content div, .koo_form_content p, .koo_form_footer a, .koo_form_content input, .form_select { font-size: 1.1rem; }
    .koo_form_content table tr td:first-child { font-size: 1.1rem; width: 5rem; }
    .form_valide_txt { line-height: 2.5rem !important; }
    .form_select { line-height: 2rem !important; }

    .qoo_topdata_container { background-size: 100% auto; height: 43rem; }
        .qoo_topdata_container .datalist { height: 25rem; }
}

@media (min-width:375px) and (max-width: 413px) {
    * { font-size: 15px; }

    #gaugeChart { height: 18rem; }
    #radarChart { padding-left: 0.3rem; height: 390px; width: 310px; }

    .koo_form_content div { font-size: 1rem; }
}

@media (min-width:414px) and (max-width: 479px) {
    #radarChart { padding-left: 1.3rem; height: 430px; width: 310px; }
}

/* 适应窗口大小 
@media screen and (max-width: 374px) {
    * { font-size: 16px; line-height: 16px; }
}

@media (min-width:375px) and (max-width: 413px) {
    * { font-size: 18px; line-height: 18px; }
}

@media (min-width:414px) and (max-width: 479px) {
    * { font-size: 20px; line-height: 20px; }
}

@media (min-width:480px) and (max-width:639px) {
    * { font-size: 24px; line-height: 24px; }
}

@media screen and (min-width: 640px) {
    * { font-size: 32px; line-height: 32px; }
}*/
